<nav aria-label="Page navigation">
    
    <ul class="{{$ctrl.ulClass}}">
        <li class="page-item">
            <a class="{{$ctrl.aClass}} active" href="javascript:void(0)" ng-click="$ctrl.loadData($ctrl.pageIndex-1)" ng-show="$ctrl.pageIndex>0">Prev</a>
        </li>
        <li class="page-item" ng-class="{'{{$ctrl.activeClass}}': n==$ctrl.page}" 
            ng-repeat="n in $ctrl.range($ctrl.totalPage)">
            <a class="{{$ctrl.aClass}} " href="javascript:void(0)" ng-click="$ctrl.loadData(n-1)">{{n}}</a>
        </li>
        <li class="page-item">
            <a class="{{$ctrl.aClass}} " href="javascript:void(0)" ng-click="$ctrl.loadData($ctrl.pageIndex + 1)" ng-show="$ctrl.pageIndex < ($ctrl.totalPage-1)">Next</a>
        </li>
    </ul>
</nav>
